<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ page import="dao.*,pojo.*,java.util.*"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<link rel="stylesheet" type="text/css" href="css/default.css" />
<script type="text/javascript" src="js/jquery-1.5.1.js"></script>
<script type="text/javascript">
	$(document).ready(function() {
		$("button").click(function() {			
			var queryString = $(this).attr("name");
			alert(queryString);
			var itemPerPage = 4;					
			
			$.getJSON(queryString, function(result) {
				var count = result['books'].length;
				
				$.each(result['books'], function(i, field) {					
					$("#bookImage" + i).attr("src", field['bookImage']);
					$("#bookName" + i).html(field['bookName']);
					$("#author" + i).html(field['author']);
					$("#price" + i).html(field['price']);					
				});				
				
				for(var j = itemPerPage - count ; j >= count; j--){
					$("#frmBookListbook" + j).remove();
					$("hr").remove();
				}		
				
			});															
		});
	});
</script>

<title>Book List</title>
<style type="text/css">
th {
	width: 100px;
	text-align: left;
}

tr{
	text-align: left;
}
</style>
</head>
<body>
<%@ include file="header.html"%>
<%@ include file="leftside.html" %>

<%
	String bookName = request.getParameter("bookName");
	double fromPrice = Double.parseDouble(request
			.getParameter("fromPrice"));
	double toPrice = Double
			.parseDouble(request.getParameter("toPrice"));

	SachDAO sachDAO = new SachDAO();
	List<SachPOJO> bookList = sachDAO.timKiemSach(bookName, fromPrice,
			toPrice, 1);
	
	int nSach = sachDAO.getTongSoSachTimKiemDuoc(bookName, fromPrice, toPrice);
	int nSachPerPage = ThamSoDAO.getMaxProductPerPage();
	int totalPage = 0;
	
	if (nSach % nSachPerPage == 0) {
		totalPage = nSach / nSachPerPage;		
	} else {
		totalPage = nSach / nSachPerPage + 1;
	}
	for(int i = 1; i <= totalPage; i++){
%>

	<button name="SearchBook?bookName=<%=bookName%>&fromPrice=<%=fromPrice %>&toPrice=<%=toPrice %>&page=<%=i %>">
		<%=i %>
	</button>&nbsp;

<%
	}
	if (bookList != null && bookList.size() > 0) {
		for (int i = 0; i < bookList.size(); i++) {
			SachPOJO sach = bookList.get(i);
%>
		<form action="" method="get" name="frmBookListbook<%=i %>" id="frmBookListbook<%=i %>" >
		<table width="500" border="0" name="">
			<tr>
				<td rowspan="4" id="img">
				<img id="bookImage<%=i %>" alt="<%=sach.getHinhAnh() %>" src="<%=sach.getHinhAnh() %>" width="80px" height="100px"/>
				</td>
				<th>Title</th>
				<td id="bookName<%=i %>"><%=sach.getTenSach() %></td>
			</tr>
			<tr>
				<th>Author</th>
				<td id="author<%=i %>"><%=sach.getTacGia() %></td>
			</tr>
			<tr>
				<th>Price</th>
				<td id="price<%=i %>"><%=sach.getGiaBan() %></td>
			</tr>
			<tr>
				<td colspan="2"><input name="btnBookDetail" type="submit"
					value="Details" /> <input name="btnOrder" type="submit"
					value="Order" /></td>
			</tr>
		</table>
		</form>
		<hr/>
<%
	}
	}
%>
<%@ include file="footer.html" %>
</body>
</html>